import {EventEmitter} from 'events';
import {matrix, multiply} from 'mathjs';
import {Point} from '../type';
import {
    BASE_HELP_CONTROL_BOUND_ID,
    BASE_HELP_CONTROL_POINT_ID,
    BASE_HELP_HIDDEN,
    EDIT_CLOSE_BTN,
    EDIT_ROTATE_BTN,
    EDIT_MOVE_BTN
} from '../constants';
import {create, createHidden, getElement, off, on, remove} from '../utils/DomUtil';
import {
    createControlPoints,
    formatPlotData, getBoundByPixels,
    getBoundCenterPoint,
    getControlPixelsByCenter,
    updateControlPixels, updateControlCoordinateByRadians, updateControlCoordinateByTranslate
} from '../utils/FormatUtil';
import {PlotTypes} from '../enum/PlotTypes';
import {calculateDegrees, calculateRadians, calculateScale, calculateWidthAndHeight} from '../utils';

// @ts-ignore
const DragPan = ol.interaction.DragPan;

export default class PlotEdit extends EventEmitter {
    private activePlot: any;
    private startPoint: any;
    private ghostControlPoints: any;
    // 控制点列表
    private controlPoints: Array<any>;
    private mouseOver: boolean;
    private elementTable: any;
    private activeControlPointId: any;
    private activeControlPoint: Point | null = null;
    private activePlotCenter: Point;
    private mapDragPan: any;
    private previousCursor: any;
    /** 激活编辑标绘的所有点位数据列表 **/
    private _activePaths: any;
    /** 激活编辑标绘的中心点数据 **/
    private _activeCenter: any;

    private _rotateControlDownPoint: any;
    private _rotateControlStartPoint: any;
    private _translateControlDownPoint: any;
    private _translateControlStartPoint: any;

    private readonly _map: any;
    private readonly _mapViewport: any;
    private readonly _options: any;
    private readonly _editBoundDomId: string = 'edit-bound';
    private readonly _closeBtnDomId: string = 'close-btn';
    private readonly _rotateBtnDomId: string = 'rotate-btn';
    private readonly _moveBtnDomId: string = 'move-btn';

    constructor(map: any, options: any = {}) {
        super();
        this._map = map;
        this._mapViewport = map.getViewport();
        options.limitControlPoints = options.limitControlPoints ? options.limitControlPoints : 50;
        this._options = options || {};

        this.activePlot = null;
        this.startPoint = null;
        this.ghostControlPoints = null;
        this.controlPoints = [];
        this.mouseOver = false;
        this.elementTable = {};
        this.activeControlPointId = null;
        this.activeControlPoint = null;
        this.activePlotCenter = [0, 0];
        this.mapDragPan = null;
        this.previousCursor = null;
    }

    /**
     * 激活编辑工具
     * @param feature
     */
    public activate = (feature: any): void => {
        if (feature && feature.get('isPlot') && feature.getGeometry().isPlot && feature !== this.activePlot) {
            this.deactivate();
            this.activePlot = feature;
            this.activePlot.status = 'selected';
            if (feature.get('plotType') !== 'point') {
                // @ts-ignore
                const highStyle = new ol.style.Style({
                    // @ts-ignore
                    fill: new ol.style.Fill({
                        color: feature.getStyle().getFill()?.getColor()
                    }),
                    // @ts-ignore
                    stroke: new ol.style.Stroke({
                        color: feature.getStyle().getStroke().getColor(),
                        width: feature.getStyle().getStroke().getWidth() * 3
                    })
                });
                feature.setStyle(highStyle);
            }
            this.previousCursor = this._map.getTargetElement().style.cursor;
            this._map.on('pointermove', this.plotMouseOverOutHandler);
            /*this.deactivate();
            this.activePlot = feature;
            this.previousCursor = this._map.getTargetElement().style.cursor;
            window.setTimeout(() => {
                this.emit('active_plot_change', this.activePlot);
            }, 500);
            this._map.on('pointermove', this.plotMouseOverOutHandler);
            this.initHelperDom();
            this.initControlPoints();*/
        }
    };
    /**
     * 激活编辑
     * @param feature
     */
    public activateEdit = (feature: any): void => {
        this.deactivate();
        this.activePlot = feature;
        this.activePlot.status = 'edited';

        if (!this._map || !this.activePlot) return;
        let parent: any = this.getMapParentElement();
        if (!parent) return;
        const hiddenDiv: HTMLElement = createHidden('div', parent, BASE_HELP_HIDDEN);
        this.createMoveBtn(hiddenDiv);
        this.createEditControlBound(hiddenDiv);
        this.createCloseBtn(hiddenDiv);
        if (this.activePlot.get('plotType') !== PlotTypes.CIRCLE) {
            this.createRotateBtn(hiddenDiv);
        }

        this.resetActivePlotParams();
    };

    /**
     * 注销编辑工具
     */
    public deactivate = (): void => {
        // this.activePlot
        if (this.activePlot && this.activePlot.status === 'selected' && this.activePlot.get('plotType') !== 'point') {
            // @ts-ignore
            const normalStyle = new ol.style.Style({
                // @ts-ignore
                fill: new ol.style.Fill({
                    color: this.activePlot.getStyle().getFill()?.getColor()
                }),
                // @ts-ignore
                stroke: new ol.style.Stroke({
                    color: this.activePlot.getStyle().getStroke().getColor(),
                    width: this.activePlot.getStyle().getStroke().getWidth() / 3
                })
            });
            this.activePlot.setStyle(normalStyle);
        }
        this.activePlot = null;
        this.mouseOver = false;
        this._map.getTargetElement().style.cursor = this.previousCursor;
        this.previousCursor = null;
        this.destroyHelperDom();
        this.disconnectEventHandlers();
        this.enableMapDragPan();
        this.elementTable = {};
        this.activeControlPointId = null;
        this.startPoint = null;
    };

    /**
     * 创建编辑边框
     */
    private createEditControlBound = (hiddenDiv: HTMLElement): void => {
        create('div', BASE_HELP_CONTROL_BOUND_ID, hiddenDiv, this._editBoundDomId);
        const centerPosition: Array<number> = getBoundCenterPoint(this.activePlot.getGeometry().getExtent());
        this.activePlotCenter = [centerPosition[0], centerPosition[1]];
        this.addEditBound(centerPosition);
        const controlPixels: Array<Array<number>> = getControlPixelsByCenter(this._map.getPixelFromCoordinate(centerPosition), getElement(this._editBoundDomId));
        const controlPositions: Array<Array<number>> = controlPixels.map((item: Array<number>): any => (this._map.getCoordinateFromPixel(item)));
        for (let i: number = 0; i < controlPositions.length; i++) {
            let id: string = `${BASE_HELP_CONTROL_POINT_ID}-${i}`;
            create('div', BASE_HELP_CONTROL_POINT_ID, hiddenDiv, id);
            this.elementTable[id] = i;
            this.addControlPoint(controlPositions[i], i);
        }
        this._map.render();
    };

    private createCloseBtn = (hiddenDiv: HTMLElement): void => {
        create('div', EDIT_CLOSE_BTN, hiddenDiv, this._closeBtnDomId);
        const element: HTMLElement = getElement(this._closeBtnDomId);
        // @ts-ignore
        const pnt: any = new ol.Overlay({
            id: this._closeBtnDomId,
            position: this.controlPoints[1].getPosition(),
            positioning: 'center-center',
            element
        });
        this._map.addOverlay(pnt);
        if (on) {
            on(element, 'click', this.closeBtnHandler);
        }
    };

    private createRotateBtn = (hiddenDiv: HTMLElement): void => {
        create('div', EDIT_ROTATE_BTN, hiddenDiv, this._rotateBtnDomId);
        const element: HTMLElement = getElement(this._rotateBtnDomId);
        // @ts-ignore
        const pnt: any = new ol.Overlay({
            id: this._rotateBtnDomId,
            position: this.controlPoints[2].getPosition(),
            positioning: 'center-center',
            element
        });
        this._map.addOverlay(pnt);
        if (on) {
            on(element, 'mousedown', this.rotateMouseDownHandler);
            // on(this._mapViewport, 'mouseup', this.rotateMouseUpHandler);
        }
    };

    private createMoveBtn = (hiddenDiv: HTMLElement): void => {
        create('div', EDIT_MOVE_BTN, hiddenDiv, this._moveBtnDomId);
        const element: HTMLElement = getElement(this._moveBtnDomId);
        const centerPosition: Array<number> = getBoundCenterPoint(this.activePlot.getGeometry().getExtent());
        // @ts-ignore
        const pnt: any = new ol.Overlay({
            id: this._moveBtnDomId,
            position: centerPosition,
            positioning: 'center-center',
            element
        });
        this._map.addOverlay(pnt);
        if (on) {
            on(element, 'mousedown', this.moveMouseDownHandler);
            // on(this._mapViewport, 'mouseup', this.moveMouseUpHandler);
            on(element, 'mouseup', this.moveMouseUpHandler);
        }
    };

    private closeBtnHandler = (event: any): void => {
        this.emit('deleteComplete', {
            type: 'deleteComplete',
            originalEvent: event,
            feature: this.activePlot
        });
        this.destroyHelperDom();
        if (off) {
            off(event.currentTarget, 'click', this.closeBtnHandler);
        }
    };

    private rotateMouseDownHandler = (event: any): void => {
        this._map.on('pointermove', this.rotateMouseMoveHandler);
        if (on) {
            on(this._mapViewport, 'mouseup', this.rotateMouseUpHandler);
        }
        this._rotateControlDownPoint = this.controlPoints[2].getPosition();
        this._rotateControlStartPoint = this.controlPoints.map((item: any): Array<Point> => {
            const [x, y] = item.getPosition();
            return [x, y];
        });
        this.resetActivePlotParams();
    };

    private rotateMouseUpHandler = (event: any): void => {
        this._map.un('pointermove', this.rotateMouseMoveHandler);
        if (off) {
            off(this._mapViewport, 'mouseup', this.rotateMouseUpHandler);
        }
        this.activateEdit(this.activePlot);
        this.emit('rotateComplete', {
            type: 'rotateComplete',
            originalEvent: event,
            feature: this.activePlot
        });
    };

    private rotateMouseMoveHandler = (event: any): void => {
        let coordinate: Point = event.coordinate;
        const boundDom: any = getElement(this._editBoundDomId);
        if (boundDom) {
            const plotType: string = this.activePlot.get('plotType');
            const centerCoordinate: Point = getBoundCenterPoint(this.activePlot.getGeometry().getExtent());
            const [centerX, centerY] = this._map.getPixelFromCoordinate(centerCoordinate);
            const [oldX, oldY] = this._map.getPixelFromCoordinate(this._rotateControlDownPoint);
            const [newX, newY]: number[] = this._map.getPixelFromCoordinate(coordinate);
            const radians: number = calculateRadians([oldX, oldY], [newX, newY], [centerX, centerY]);
            const angle: number = calculateDegrees([oldX, oldY], [newX, newY], [centerX, centerY]);
            boundDom.style.transform = `rotate(${radians}rad)`;
            const newControlCoordinates: Array<Point> = updateControlCoordinateByRadians(this._rotateControlStartPoint, angle, centerCoordinate);
            this.updateControlPosition(newControlCoordinates);
            if (plotType === PlotTypes.POINT) {
                this.activePlot.getStyle().getImage().setRotation(angle * Math.PI / 180);
                this.activePlot.setStyle(this.activePlot.getStyle());
            } else {
                let plot: any = this.activePlot.getGeometry();
                plot.transform('rotate', {
                    angle,
                    centerX: this._activeCenter[0],
                    centerY: this._activeCenter[1],
                    paths: this._activePaths
                });
            }
        }
    };

    private moveMouseDownHandler = (event: any): void => {
        this._map.on('pointermove', this.moveMouseMoveHandler);
        this._translateControlDownPoint = [this._activeCenter[0], this._activeCenter[1]];
        this._translateControlStartPoint = this.controlPoints.map((item: any): Array<Point> => {
            const [x, y] = item.getPosition();
            return [x, y];
        });
    };

    private moveMouseUpHandler = (event: any): void => {
        this._map.un('pointermove', this.moveMouseMoveHandler);
        this.activateEdit(this.activePlot);
        this.emit('translateComplete', {
            type: 'translateComplete',
            originalEvent: event,
            feature: this.activePlot
        });
    };

    private moveMouseMoveHandler = (event: any): void => {
        let coordinate: Point = event.coordinate;
        const coordinatesDx: number = coordinate[0] - this._activeCenter[0];
        const coordinatesDy: number = coordinate[1] - this._activeCenter[1];
        const newControlPositions: Array<Point> = updateControlCoordinateByTranslate(this._translateControlStartPoint, [coordinatesDx, coordinatesDy]);
        this.updateControlPosition(newControlPositions);
        let plot: any = this.activePlot.getGeometry();
        plot.transform('translate', {
            deltaX: coordinatesDx,
            deltaY: coordinatesDy,
            centerX: this._activeCenter[0],
            centerY: this._activeCenter[1],
            paths: this._activePaths
        });
        const centerCoordinate: Point = getBoundCenterPoint(this.activePlot.getGeometry().getExtent());
        const moveBtnOverlay: any = this._map.getOverlayById(this._moveBtnDomId);
        if (moveBtnOverlay) {
            moveBtnOverlay.setPosition(centerCoordinate);
        }
        const boundOverlay: any = this._map.getOverlayById(this._editBoundDomId);
        if (boundOverlay) {
            boundOverlay.setPosition(centerCoordinate);
        }
    };
    /**
     * 销毁帮助提示DOM
     */
    private destroyHelperDom = (): void => {
        if (this.controlPoints && Array.isArray(this.controlPoints) && this.controlPoints.length > 0) {
            this.controlPoints.forEach((item: any, index: number): void => {
                // @ts-ignore
                if (item && item instanceof ol.Overlay) {
                    this._map.removeOverlay(item);
                }
                let element: HTMLElement = getElement(`${BASE_HELP_CONTROL_POINT_ID}-${index}`);
                if (element) {
                    if (off) {
                        off(element, 'mousedown', this.controlPointMouseDownHandler);
                        off(element, 'mousemove', this.controlPointMouseMoveHandler2);
                    }
                }
            });
            this.controlPoints = [];
        }
        if (this._map.getOverlayById(this._editBoundDomId)) {
            this._map.removeOverlay(this._map.getOverlayById(this._editBoundDomId));
        }
        if (this._map.getOverlayById(this._closeBtnDomId)) {
            this._map.removeOverlay(this._map.getOverlayById(this._closeBtnDomId));
        }
        if (this._map.getOverlayById(this._rotateBtnDomId)) {
            this._map.removeOverlay(this._map.getOverlayById(this._rotateBtnDomId));
        }
        if (this._map.getOverlayById(this._moveBtnDomId)) {
            this._map.removeOverlay(this._map.getOverlayById(this._moveBtnDomId));
        }
        let parent: any = this.getMapParentElement();
        let hiddenDiv: any = getElement(BASE_HELP_HIDDEN);
        if (hiddenDiv && parent) {
            remove(hiddenDiv);
        }
    };

    /**
     * 添加控制点
     * @param position
     * @param index
     */
    private addControlPoint = (position: Array<any>, index: number): void => {
        const id: string = `${BASE_HELP_CONTROL_POINT_ID}-${index}`;
        this.elementTable[id] = index;
        const element: HTMLElement = getElement(id);
        /*        if (index === 8) {  // 锚点样式，圆形
                    element.style.borderRadius = '100%';
                }*/
        // @ts-ignore
        const pnt: any = new ol.Overlay({
            id,
            position,
            positioning: 'center-center',
            element
        });
        this.controlPoints.push(pnt);
        this._map.addOverlay(pnt);
        if (on) {
            on(element, 'mousedown', this.controlPointMouseDownHandler);
            on(element, 'mousemove', this.controlPointMouseMoveHandler2);
        }
    };
    /**
     * 添加图形边界
     * @param position
     */
    private addEditBound = (position: any): void => {
        const plotType: string = this.activePlot.get('plotType');
        let topRightPixel: number[] = [];
        let bottomLeftPixel: number[] = [];
        if (plotType === PlotTypes.POINT) {
            const [width, height]: Array<number> = this.activePlot.getProperties().size;
            const centerCoordinate: Point = this.activePlot.getGeometry().points[0];
            const centerPixel: number[] = this._map.getPixelFromCoordinate(centerCoordinate);
            bottomLeftPixel = [centerPixel[0] - width / 2, centerPixel[1] - height / 2];
            topRightPixel = [centerPixel[0] + width / 2, centerPixel[1] + height / 2];
        } else {
            const [x1, y1, x2, y2] = this.activePlot.getGeometry().getExtent();
            bottomLeftPixel = this._map.getPixelFromCoordinate([x1, y1]);
            topRightPixel = this._map.getPixelFromCoordinate([x2, y2]);
        }
        const dx: number = Math.abs(Math.floor(topRightPixel[0] - bottomLeftPixel[0]));
        const dy: number = Math.abs(Math.floor(topRightPixel[1] - bottomLeftPixel[1]));
        const element: HTMLElement = getElement(this._editBoundDomId);
        // @ts-ignore
        const pnt: any = new ol.Overlay({
            id: this._editBoundDomId,
            position,
            positioning: 'center-center',
            element
        });
        element.style.width = `${dx}px`;
        element.style.height = `${dy}px`;
        this._map.addOverlay(pnt);
    };

    private controlPointMouseDownHandler = (evt: any): void => {
        this.activeControlPointId = evt.target.id;
        let overlay: any = this._map.getOverlayById(this.activeControlPointId);
        this.activeControlPoint = [overlay.getPosition()[0], overlay.getPosition()[1]];
        this._map.on('pointermove', this.controlPointMouseMoveHandler);
        if (on) {
            on(this._mapViewport, 'mouseup', this.controlPointMouseUpHandler);
        }
    };

    private controlPointMouseMoveHandler2 = (evt: any): void => {
        evt.stopImmediatePropagation();
    };

    private controlPointMouseMoveHandler = (event: any): void => {
        let coordinate: Point = event.coordinate;
        if (this.activeControlPointId) {
            const boundDom: any = getElement(this._editBoundDomId);
            if (boundDom) {
                const plotType: string = this.activePlot.get('plotType');
                const centerCoordinate: Point = getBoundCenterPoint(this.activePlot.getGeometry().getExtent());
                // 缩放之前的宽高
                const {width, height}: {
                    width: number,
                    height: number
                } = calculateWidthAndHeight(centerCoordinate, this.activeControlPoint as Point);
                // 缩放之后的宽高
                const {width: scaleWidth, height: scaleHeight}: {
                    width: number,
                    height: number
                } = calculateWidthAndHeight(centerCoordinate, coordinate);

                const [scaleX, scaleY] = calculateScale([scaleWidth, scaleHeight], [width, height]);

                const [centerX, centerY] = this._map.getPixelFromCoordinate(this.activePlotCenter);
                // const [oldX, oldY] = this._map.getPixelFromCoordinate(this.activeControlPoint);
                const [newX, newY]: number[] = this._map.getPixelFromCoordinate(coordinate);
                const newDisX: number = Math.abs(newX - centerX);
                const newDisY: number = Math.abs(newY - centerY);
                const newPixels: Array<Point> = updateControlPixels([centerX, centerY], [newDisX, newDisY], plotType);
                const newControlPositions: Array<Array<number>> = newPixels.map((item: Point): any => (this._map.getCoordinateFromPixel(item)));
                const [domWidth, domHeight] = getBoundByPixels(newPixels);
                boundDom.style.width = `${domWidth}px`;
                boundDom.style.height = `${domHeight}px`;
                this.updateControlPosition(newControlPositions);
                if (plotType === PlotTypes.POINT) {
                    this.activePlot.getStyle().getImage().setScale([scaleX, scaleY]);
                    this.activePlot.setStyle(this.activePlot.getStyle());
                } else {
                    let plot: any = this.activePlot.getGeometry();
                    plot.transform('scale', {
                        scaleX,
                        scaleY,
                        centerX: this._activeCenter[0],
                        centerY: this._activeCenter[1],
                        paths: this._activePaths
                    });
                }
            }
        }
    };
    private controlPointMouseUpHandler = (event: any): void => {
        this.activeControlPoint = null;
        this.resetActivePlotParams();
        this._map.un('pointermove', this.controlPointMouseMoveHandler);
        if (off) {
            off(this._mapViewport, 'mouseup', this.controlPointMouseUpHandler);
            this.emit('scaleComplete', {
                type: 'scaleComplete',
                originalEvent: event,
                feature: this.activePlot
            });
            /*const plotType: string = this.activePlot.getProperties().plotType;
            if (plotType === PlotTypes.POINT) {
                this.emit('moveEnd', {
                    type: 'moveEnd',
                    originalEvent: event,
                    feature: this.activePlot,
                    data: formatPlotData(this.activePlot.getProperties().plotType, this.activePlot)
                });
            } else {
                this.emit('deformationEnd', {
                    type: 'deformationEnd',
                    originalEvent: event,
                    feature: this.activePlot,
                    data: formatPlotData(this.activePlot.getProperties().plotType, this.activePlot)
                });
            }*/
        }
    };

    /**
     * 获取地图元素的父元素
     */
    private getMapParentElement = (): any => {
        let mapElement: HTMLElement = this._map.getTargetElement() as HTMLElement;
        if (!mapElement) return;
        return mapElement.parentNode;
    };

    private getControlPoints = (): any => {
        let points: Array<Point> = [];
        if (this.activePlot) {
            let geom: any = this.activePlot.getGeometry();
            if (geom) {
                points = geom.getPoints();
            }
        }
        return points;
    };

    private plotMouseOverOutHandler = (evt: any): void => {
        const feature: any = this._map.forEachFeatureAtPixel(evt.pixel, (feature: any): any => feature);
        if (feature && feature === this.activePlot) {
            if (!this.mouseOver) {
                this.mouseOver = true;
                this._map.getTargetElement().style.cursor = 'move';
                this._map.on('pointerdown', this.plotMouseDownHandler);
            }
        } else {
            if (this.mouseOver) {
                this.mouseOver = false;
                this._map.getTargetElement().style.cursor = 'default';
                this._map.un('pointerdown', this.plotMouseDownHandler);
            }
        }
    };

    private plotMouseDownHandler = (evt: any): void => {
        this.ghostControlPoints = this.getControlPoints();
        this.startPoint = evt.coordinate;
        this.disableMapDragPan();
        this._map.on('pointerup', this.plotMouseUpHandler);
        this._map.on('pointerdrag', this.plotMouseMoveHandler);
    };

    private plotMouseMoveHandler = (event: any): void => {
        let deltaX: number = event.coordinate[0] - this.startPoint[0];
        let deltaY: number = event.coordinate[1] - this.startPoint[1];
        let newPoints: any = [];
        if (this.ghostControlPoints && Array.isArray(this.ghostControlPoints) && this.ghostControlPoints.length > 0) {
            for (let i: number = 0; i < this.ghostControlPoints.length; i++) {
                let coordinate: any = [this.ghostControlPoints[i][0] + deltaX, this.ghostControlPoints[i][1] + deltaY];
                newPoints.push(coordinate);
                let id: string = BASE_HELP_CONTROL_POINT_ID + '-' + i;
                let overlay: any = this._map.getOverlayById(id);
                if (overlay) {
                    overlay.setPosition(coordinate);
                    overlay.setPositioning('center-center');
                }
            }
        }
        const geometry: any = this.activePlot.getGeometry();
        geometry.setPoints(newPoints);
    };

    private plotMouseUpHandler = (event: any): void => {
        this.enableMapDragPan();
        this._map.un('pointerup', this.plotMouseUpHandler);
        this._map.un('pointerdrag', this.plotMouseMoveHandler);
        this.emit('moveEnd', {
            type: 'moveEnd',
            originalEvent: event,
            feature: this.activePlot,
            data: formatPlotData(this.activePlot.getProperties().plotType, this.activePlot)
        });
    };

    private disconnectEventHandlers = (): void => {
        this._map.un('pointermove', this.plotMouseOverOutHandler);
        this._map.un('pointermove', this.controlPointMouseMoveHandler);
        if (off) {
            off(this._mapViewport, 'mouseup', this.controlPointMouseUpHandler);
            off(this._mapViewport, 'mouseup', this.moveMouseUpHandler);
        }
        this._map.un('pointerdown', this.plotMouseDownHandler);
        this._map.un('pointerup', this.plotMouseUpHandler);
        this._map.un('pointerdrag', this.plotMouseMoveHandler);
    };
    /**
     * 禁止地图平移
     */
    private disableMapDragPan = (): void => {
        let interactions: Array<any> = this._map.getInteractions().getArray();
        interactions.every((item: any): boolean => {
            // @ts-ignore
            if (item instanceof DragPan) {
                this.mapDragPan = item;
                this._map.removeInteraction(item);
                return false;
            } else {
                return true;
            }
        });
    };
    /**
     * 开启地图平移
     */
    private enableMapDragPan = (): void => {
        // @ts-ignore
        if (this.mapDragPan && this.mapDragPan instanceof ol.interaction.DragPan) {
            this._map.addInteraction(this.mapDragPan);
            this.mapDragPan = null;
        }
    };
    /**
     * 重置当前编辑的要素的中心点和坐标点
     */
    private resetActivePlotParams = (): void => {
        this._activePaths = this.activePlot.getGeometry().getPoints();
        this._activeCenter = getBoundCenterPoint(this.activePlot.getGeometry().getExtent());
    };

    private updateControlOfCloseAndRotate = (positions: any): void => {
        const closeBtnOverlay: any = this._map.getOverlayById(this._closeBtnDomId);
        if (closeBtnOverlay) {
            closeBtnOverlay.setPosition(positions[1]);
        }

        const rotateBtnOverlay: any = this._map.getOverlayById(this._rotateBtnDomId);
        if (rotateBtnOverlay) {
            rotateBtnOverlay.setPosition(positions[2]);
        }
    };

    private updateControlPosition = (positions: any): void => {
        for (let i: number = 0; i < positions.length; i++) {
            let id: string = `${BASE_HELP_CONTROL_POINT_ID}-${i}`;
            let overlay: any = this._map.getOverlayById(id);
            if (overlay) {
                overlay.setPosition(positions[i]);
            }
        }
        this.updateControlOfCloseAndRotate(positions);
    };
}
